
<script setup>
defineProps({
    blog: {
        id:Number,
        title: String,
        author: String,
        summary: String,
        tag:undefined,
        createdOn:Date,
        view_amount:Number,
    }
})
</script>

<template>
    <div class="card shadow white black_blog text-break blog move-trans-toLeft position-relative" style="min-height: 200px;margin-bottom: 15pt;">
        <a class="card-body"  :href="`/article/${blog.id}`" style="text-decoration: none; display: block;">
        <h4 class="card-title">{{ blog.title }}</h4>
        <div class="tags">
            <span v-for="tagName in blog.tag" class="tag">
				{{ blog.tagName }}
            </span>
        </div>
        <p class="card-text">{{ blog.summary }}</p>
		<p class="position-absolute bottom-0 end-0 me-3 mb-2 fs-6" >浏览：{{ blog.view_amount }}</p>
        </a>
    </div>
    
</template>

<style scoped>
    .tags {
        display: inline-block;
        margin-bottom: 10px; /* 调整标签和摘要之间的间距 */
    }
    .tag {
        display: inline-block;
        padding-right: 10pt;
    }
    
</style>